class: center, middle, inverse, title-slide # Compartiendo nuestra aplicación ## Curso: Introducción al análisis espacial y web-mapping
con Google Earth Engine y R Shiny
### MSc. José A. Lastra
Matías Olea
### Laboratorio Geo-Información y Percepción Remota ### 18/07/2021 --- background-image: url(data:image/png;base64,#logo_labgrs_color.png) background-position: center background-size:40% --- # Librerías utilizadas en esta sesión ```r library(shiny) library(leaflet) library(rgdal) library(tidyverse) library(sf) library(bslib) library(raster) library(plotly) library(shinythemes) library(ggfortify) ``` --- # Antes de empezar -- - Haremos uso de la aplicación raster de Temperatura superficial del mar. -- - Modificaremos el usho de *shinythemes* por la librería [*bslib*](https://github.com/rstudio/bslib) -- - Poblaremos nuestro tab secundario con la posibilidad de cargar datos y la de descargar -- - Desplegaremos esta aplicación en la web. -- - Descargue el código base y los datos de la aplicación si es que no los tiene disponibles. -- .center[ ] .center[.footnote[© Allison Horst]] --- .center[] --- # Tab secundaria -- - Agregando la opción de subir datos. - Pondremos la función *fileInput()* para habilitar esto en nuestro *sidebarPanel()* -- ```r fileInput('target_upload', 'Suba su tabla', accept = c('.csv')) ``` -- - Agregaremos la función *downloadButton()* ```r downloadButton('descargar','Descargar plot') ``` -- - Nuestro segundo tabPanel quedaría así -- ```r tabPanel('Tab secundario', sidebarLayout(sidebarPanel( fileInput('target_upload', 'Suba su tabla', accept = c('.csv')),br(), actionButton('plot',label = 'Plot'), downloadButton('descargar','Descargar plot'), fluid=T,width = 2), mainPanel(plotOutput('decom')) )) ``` --- # Generando la subida en el server -- - En este ejemplo usaremos series de tiempo en formato **.csv*; si quiséramos otros tipos de archivos hay que realizar la configuración adecuada. -- ```r datos <- reactive({ req(input$target_upload) inFile <- input$target_upload if (is.null(inFile)) return(NULL) df <- read_csv(inFile$datapath) df_subset <- df[,'sst'] return(df_subset) }) ``` -- - Crearemos un elemento reactivo que contendrá el gráfico -- ```r graf <- eventReactive(input$plot,{ req(!is.null(datos())) ts.serie <- ts(datos(),start=c(1981,244),end=c(2020,117),frequency=365) g <- autoplot(ts.serie, ylab = 'SST °C',asp = 0.2) g }) ``` --- #Renderizando el gráfico -- ```r observeEvent(input$plot,{ req(!is.null(datos())) output$decom <- renderPlot({ graf() }) }) ``` -- .center[  ] --- # Configurando al descarga -- ```r ## habilitar descarga output$descargar <- downloadHandler( #nombre de archivo filename = "serie.jpg", content = function(file){ ggsave(file, graf(),dpi = 150,width = 15,height = 10) } ) ``` --- # Añadamos un pequeño proceso en los datos -- - Para esto añadiremos la función *checkboxInput()* -- - Nuestro tabPanel queda de la siguiente manera -- ```r tabPanel('Tab secundario', sidebarLayout(sidebarPanel( fileInput('target_upload', 'Suba su tabla',accept = c('.csv')),br(), checkboxInput("desc", label = "Descomponer serie", value = F),br(), actionButton('plot',label = 'Plot'), downloadButton('descargar','Descargar plot'), fluid=T,width = 2), mainPanel(plotOutput('decom')) )) ``` --- #En el server -- - Cambiaremos el código que crea los gráficos -- ```r graf <- eventReactive(input$plot,{ req(!is.null(datos())) ts.serie <- ts(datos(),start=c(1981,244),end=c(2020,117),frequency=365) if(input$desc == T){ g <- decompose(ts.serie) %>% autoplot() } if(input$desc == F){ g <- autoplot(ts.serie, ylab = 'SST °C',asp = 0.2)} g }) ``` --- class: middle, center  --- # Modificando nuestro tema -- - En la app inicial usamos la función *shinyTheme('cerulean')* para dar colores y formatos a nuestra aplicación de forma general. -- - La librería *bslib* nos permite mejorar la personalización de nuestras app empleando bootstrap 4. -- - En nuestro argumento *theme =* reemplazaremos shinyTheme() por lo siguiente: ```r theme = bs_theme(version = 4, bg = "#040404", fg = "#FFF1F1", font_scale = 0.8, bootswatch = "litera") ``` -- - Podemos ver y personalizar aún más nuestro tema empleando `bslib::bs_theme_preview()`. --- class: middle, center  --- # Compartiendo nuestros desarrollos web -- - El desarrollo de cualquier aplicación de análisis, ya sea de datos o geo-datos, puede tener una utilidad significativa en algún área o proceso de toma de decisiones. -- - Es por esto que luego de desarrollarla, debemos pensar en como masificar su uso y difusión. -- - Existen variadas formas de compartir nuestros recursos en la web o de forma local con otros usuarios y usuarias. -- - A continuación veremos algunos ejemplos de compartir en nuestras aplicaciones. --- # Métodos locales -- - Compartir el script y los datos: Esta es la forma más convencional de compartir una app y simplemente consiste en compartir los archivos que hacen funcionar nuestra aplicación para que los usuarios la puedan correr localmente. -- - Compartir URL: otra forma es zippear la aplicación y alojarla en algún sitio (GoogleDrive, Dropbox u otro) y compartir la url para que los usuarios puedan acceder al archivo de la siguiente manera: ```r runUrl("<url al zip>") ``` --- #Github -- De manera complementaria uno puede alojar sus aplicaciones en GitHub o en Gist y puede dar acceso a las mismas considerando el nombre de repositorio y la app para que los usuarios puedan acceder. -- ```r runGitHub( "oceDataApp", "JoseLastra") ``` --- class: middle, center  --- #En la web Una forma de compartir es simplemente alojar nuestra aplicación en un servicio y poder ponerla a disposición en un servidor externo o propio.Existen varias opciones donde las más comunes son el uso de: -- - [Shinyapps.io](https://www.shinyapps.io/): Una de las formas más fáciles de subir trabajando directamente desde RStudio. -- - [Shiny Server](https://rstudio.com/products/shiny/shiny-server/): Es un programa complementario que permite configurar un servidor para el alojamiento y despliegue de aplicaciones. Necesitará un servidor Linux con Ubuntu 12.04 o superior (64 bits) y CentOS / RHEL 5 (64 bits) para poder operar Shiny Server. -- - [RStudio Connect](https://rstudio.com/products/connect/): es una plataforma de publicación para el trabajo que crean sus equipos en R y Python. Contempla no solo shiny apps sino que también otros productos (informes de R Markdown, Plumber APIs, dashboards, Jupyter Notebooks, contenido interactivo de Python). --- #Desplegando en Shinyapps.io -- - Antes de comenzar es importante disponer de una cuenta gratuita en [Shinyapps.io](https://www.shinyapps.io/) -- - Con nuestra cuenta activa, debemos instalar la librería rsconnect que nos permitirá subir nuestras aplicaciones directamente desde RStudio. -- ```r install.packages('rsconnect') ``` -- - Una vez instalada, la cargaremos en nuestro entorno mediante la función `library(rsconnect)`. -- - Ahora, iremos a nuestra cuenta de shinyapps.io y en nuestro perfil debemos ubicar la opción Tokens donde encontraremos una ventana con varios códigos para nuestra cuenta. --- class: middle, center  --- - Aquí, oprimiremos la opción *Show secret* para que nos muestre los valores necesarios y los copiaremos en nuestro portapapeles. -- .center[  ] -- - Para conectar nuestra cuenta, abriremos primero nuestra aplicación de sitios turísticos la desplegaremos (Run App) y buscaremos el botón de publicación. .center[  ] --- -- - Si disponemos de una cuenta ya conectada, por defecto nos dará la opción de publicarla en esa cuenta pero sino hemos vinculado nada debemos proceder a conectarla usando la información que pegamos desde los *Tokens*. -- .center[  ] --- .center[  ] -- - Con la cuenta conectada, debemos seleccionar los archivos a montar sobre nuestro sitio, el título de la aplicación y ver la cuenta de conexión (en caso de disponer de varias). --- class: middle, center  --- class: middle, center  --- # Nota adicional -- - Estas son los ejemplos más comunes de despliegue -- - También se pueden montar shiny apps completamente funcionales, empleando otros servicios web como mediante máquinas virtuales en Google, AWS (Amazon Web Services), Digital Ocean u otros similares. -- - La decisión de una u otra depende exclusivamente de la escalabilidad, volumen de datos, tráfico y capacidad analítica requerida para un correcto funcionamiento. --- background-image: url(data:image/png;base64,#logo_labgrs_color.png) background-position: center background-size:40%